<template>
	<view class="tablist">
		<view class="itemlist"  @click="tohome">
			<view class="icon"><image src="/static/tabbar/home.png"></image></view>
			<view class="title home-title">首页</view>
		</view> 
		<view class="itemlist"  @click="torelease">
			<view class="shadow"></view>
			<view class="place_order">
				<view class="small_box">
					<image src="/static/xunhuan.svg" mode=""></image>
					<view class="text fabu-title">一键发布</view>
				</view>
			</view>
		</view>
		<view class="itemlist">
			<view class="icon"><image src="/static/tabbar/mine-select.png"></image></view> 
			<view class="title mine-title">我的</view>
		</view>
	</view>
</template> 
 
<script>
	export default {
		name: 'minetab',
		data() {
			return {
				
			}
		},
		onLoad() {
			
		},
		onShow() {
			
		},
		methods:{
			tohome:function(){
				uni.reLaunch({
					url: '/pages/index/index'
				});
			},
			torelease:function(){
				uni.navigateTo({
					url: '/pages/release/index'
				});
			}
		}
	}
</script>

<style>
.tablist{
	width: 100% !important;
	display: flex;
	justify-content: space-around;
	align-items: center;
}
.itemlist .icon image{
	width: 60upx !important;
	height: 60upx !important;
}

.shadow{
	background-color: rgba(247, 174, 43,0.3);
	height: 180upx;
	width: 360upx;
	position: fixed;
	left: 0upx;
	right: 0upx;
	bottom: -20upx;
	margin-left: auto;
	margin-right: auto;
	border-radius: 180upx 180upx 0 0;
	animation: one-reclaim 0.6s infinite linear;
	animation-direction: alternate;
	}
	@-webkit-keyframes one-reclaim {
	    0% {
	        opacity: 0;
	        transform: scale(0.5);
	    }
	
	    100% {
	        opacity: 1;
	        transform: scale(1);
	    }
	}
	
	@keyframes one-reclaim {
	    0% {
	        opacity: 0;
	        transform: scale(0.5);
	    }
	
	    100% {
	        opacity: 1;
	        transform: scale(1);
	    }
	}
	
	.place_order{
		background-color: rgba(247, 174, 43,0.4);
		height: 130upx;
		width: 260upx;
		position: fixed;
		left: 0upx;
		right: 0upx;
		bottom: 0upx;
		margin-left: auto;
		margin-right: auto;
		border-radius: 130upx 130upx 0 0;
	}
	
	.small_box{
		background-color: rgba(247, 174, 43,.6);
		height: 110upx;
		width: 220upx;
		position: fixed;
		left: 0upx;
		right: 0upx;
		bottom: 0upx;
		margin-left: auto;
		margin-right: auto;
		border-radius: 110upx 110upx 0 0;
		text-align: center;
		padding-top: 10upx;
	}
	.small_box image{
		width: 14px;
		height: 14px;
	}
	.small_box .text{
		color: #fff;
		font-size: 28upx;
	}
</style>
